import React, { Component } from 'react'
import { Suspense } from 'react'
import { Route, Routes, Navigate, BrowserRouter } from 'react-router-dom'
import { RouterItem } from "../type/route.d"
import routes from './routerConfig'
export default function RouterView() {
    const renderDom = (routes: RouterItem[]) => {
        return routes.map((item, index) => {
            return <Route key={index} path={item.path} element={item.to ? <Navigate to={item.to}></Navigate> : <item.component></item.component>}>
                {
                    item.children&&renderDom(item.children)
                }
            </Route>
        })
    }
    return (
        <BrowserRouter>
            <Suspense fallback={<div>加载中...</div>}>
                <Routes>
                    {
                        renderDom(routes)
                    }
                </Routes>
            </Suspense>
        </BrowserRouter>
    )


}

